<template>
	<view class="conter">
		<view class="box">
			<view class="sfntio_box">
				<view>时间</view>
				<view style="margin-left: 110rpx">数量</view>
				<view>火力值</view>
			</view>
			<u-list @scrolltolower="scrolltolower"  height="1050rpx">
				<u-list-item v-for="(item, index) in guildAllocationRecordDetailList" :key="index">
					<view class="list_box">
						<view style="display: flex; align-items: center">
							<view class="header_box">
								<u--image width="91rpx" height="91rpx" radius="50%" :src="imgUrl + item.avatar"></u--image>
							</view>
							<view style="margin-left: 13rpx">
								<view class="name_box">{{ item.nickname }}</view>
								<view class="time_box">{{ item.divideTime }}</view>
							</view>
						</view>
						<view class="number">{{ item.number }}</view>
						<view class="price">{{ item.influence }}</view>
					</view>
				</u-list-item>
				<view style="position: absolute" v-if="guildAllocationRecordDetailList.length == 0">
					<image style="width: 280rpx; height: 280rpx; margin: 275rpx 220rpx 0" src="../../static/images/fighting.gif" mode=""></image>
				</view>
			</u-list>
		</view>
	</view>
</template>

<script>
import config from '@/config.js';
import { guildAllocationRecordDetail, getguildAllocation, lookAllot, defaultSettings, getDefaultSettings } from '@/api/union/union.js';
export default {
	data() {
		return {
			curPage: 1,
			curPageSize: 10,
			guildAllocationRecordDetailList: [],
			totalSize: 0,
			id: 0,
			imgUrl: config.gillUrl,
			value: null,
			option: [
				{
					text: '默认同意',
					value: 1
				},
				{
					text: '默认拒绝',
					value: 2
				},
				{
					text: '每次都询问我',
					value: -1
				}
			]
		};
	},
	onLoad(option) {
		this.id = option.id;
		this.getguild = option.getguild;
		console.log(this.getguild);
		this.getDefaultSetting();
	},
	created() {
		this.getguildAllocationRecord();
		this.lookAllot();
	},
	methods: {
		async setPosition(e) {
			console.log('e:', e);
			let param = {};
			param.guildId = this.getguild;
			param.state = e;
			const data = await defaultSettings(param);
			console.log(data, '选择');
		},
		async getDefaultSetting() {
			let param = {};
			param.guildId = this.getguild;
			console.log(param.guildId);
			const data = await getDefaultSettings(param);
			console.log(data, '初始状态');
			this.value = data.data.state;
		},
		async lookAllot() {
			let param = {};
			param.allotId = this.id;
			const data = await lookAllot(param);
			console.log(data);
		},
		goGuild() {
			uni.navigateTo({
				url: '/pages/Union/allocation'
			});
		},
		async getguildAllocationRecord() {
			let param = {};
			param.page = this.curPage;
			param.size = this.curPageSize;
			param.id = this.id;
			const data = await guildAllocationRecordDetail(param);
			// console.log(data, 'data');
			let _this = this;
			data.data.map((i) => {
				_this.guildAllocationRecordDetailList.push(i);
			});
			this.totalSize = data.data.totalSize;
		},
		// list加载事件
		scrolltolower() {
			//加载时候判断是否还有下一页
			if (this.guildAllocationRecordDetailList.length < this.totalSize) {
				this.curPage++;
				//则还有下一页
				this.getguildAllocationRecord();
			} else {
				this.curPage = 1;
			}
		}
	}
};
</script>

<style>
page {
	background-color: #1a1a1a;
}
.conter {
	padding: 30rpx 34.88rpx;
	.box {
		width: 680rpx;
		height: 1245rpx;
		border-radius: 52rpx;
		border: 3rpx solid #2f2f2f;
		background: linear-gradient(180deg, #191919 0%, #282828 100%);

		.sfntio_box {
			display: flex;
			color: #ffffff;
			font-size: 31rpx;
			font-weight: 700;
			padding: 34rpx 71rpx 0 190rpx;
			justify-content: space-between;
		}

		.list_box {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 40rpx 0 12rpx;
			width: 631rpx;
			height: 117rpx;
			margin-top: 34.88rpx;
			margin-left: 24rpx;
			background: #1b1b1b;
			border-radius: 323rpx;
			border: 2rpx solid #2f2f2f;
			.header_box {
				width: 92rpx;
				height: 92rpx;
				border-radius: 44rpx;
			}
			.name_box {
				width: 200rpx;
				color: #ffffff;
				font-size: 35rpx;
				font-weight: 400;
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
				font-family: ' zcoolqingkehuangyouti, zcoolqingkehuangyouti';
			}
			.time_box {
				color: #9e9e9e;
				font-size: 24rpx;
				font-weight: 400;
				margin-top: 5rpx;
				font-family: ' zcoolqingkehuangyouti, zcoolqingkehuangyouti';
			}
			.number {
				color: #9e9e9e;
				font-size: 35rpx;
				font-weight: 400;
				font-family: ' zcoolqingkehuangyouti, zcoolqingkehuangyouti';
			}
			.price {
				width: 100rpx;
				text-align: center;
				color: #9e9e9e;
				font-size: 35rpx;
				font-weight: 400;
				font-family: ' zcoolqingkehuangyouti, zcoolqingkehuangyouti';
			}
		}
	}
}
</style>
